<template>
  <FormView
    v-model="entity"
    :title="entity.id ? '修改位置管理' : '新建位置管理'"
    :toolbar-attrs="{ buttons: ['back', 'save', 'cancel'] }"
    :toolbar-listeners="{ save: persist }">
    <FormHolder ref="form" label-width="100px" :model="entity">
      <FormItemGroup block-title="基本信息">
        <ElFormItem label="房间名称" prop="houseId" label-width="110px" :rules="houseRules">
          <VueTreeSelect
            v-model="entity.houseId"
            :options="houseOptions"
            :disable-branch-nodes="true"
            :class="['form-tree-select', { 'is-readonly': false }]"
            style="width: 99%"
            :show-count="true"
            :normalizer="normalizer"
            no-options-text="无房屋选项"
            placeholder="请选择房屋" />
        </ElFormItem>
        <FormInput v-model="entity.name" :span="24" prop="name" label="名称" max-length="255" required />
        <FormInputNumber v-model="entity.area" prop="area" label="面积" :min="0" :max="99999999" />
        <FormInputNumber v-model="entity.rent" prop="rent" label="租金" :min="0" :max="99999999" />
        <FormSelect v-model="entity.status" prop="status" required label="状态" dict-type="pos_status" />
        <FormTextarea v-model="entity.remarks" rows="5" prop="remarks" label="备注" max-length="3000" />
      </FormItemGroup>
    </FormHolder>
  </FormView>
</template>

<script>
  import { addObj, putObj, getObj } from '@/api/space/fyroomposition'
  import form from '@/vue/mixin/form'
  import { getHouseTree } from '@/api/space/fyroomhouse'

  export default {
    name: 'PositionForm',
    relativeViewId: 'PositionView',
    mixins: [form],
    data() {
      return {
        entity: {
          area: '',
          assetNumber: '',
          code: '',
          createBy: '',
          createId: 0,
          createTime: '',
          dataCode: '',
          deptFullname: '',
          deptId: 0,
          houseId: null,
          houseName: '',
          id: '',
          name: '',
          ordernumber: 0,
          parentId: 0,
          parentName: '',
          remarks: '',
          rent: '',
          status: '',
          updateBy: '',
          updateTime: ''
        },
        houseOptions: [],
        houseRules: { required: true, message: '请选择所属房屋', trigger: 'change' }
      }
    },
    created() {
      this.init()
    },
    methods: {
      load: getObj,
      save: addObj,
      update: putObj,
      async init() {
        const houseRes = await getHouseTree()
        this.houseOptions = houseRes.data.data
      },
      normalizer(node) {
        if (node.children && !node.children.length) {
          delete node.children
        }
        return {
          id: node.idCard,
          label: node.name,
          isDisabled: this.$isBlank(node.children) && !(node.affiliName === 'HOUSE'),
          children: node.children
        }
      }
    }
  }
</script>
